import ProTable from '@ant-design/pro-table';
import type { ProColumns } from '@ant-design/pro-table';
import ProForm,{ ProFormText,ProFormTextArea, ProFormRadio, ProFormDatePicker, ProFormSelect } from '@ant-design/pro-form';
import { Upload, Modal,message,Form ,Cascader,Button,Popconfirm} from 'antd';
import React, {PureComponent } from 'react';
import { Tabs } from 'antd';
const { TabPane } = Tabs;
import {RecvAddress} from  '../../model'
import AddressDialog from './AddressDialog';
import request from '@/utils/request';
import { PlusOutlined } from '@ant-design/icons';
const { confirm } = Modal;
class DealerInfo extends PureComponent<any,any>{
  static propTypes:{
    data:any
    showForm?:boolean
  }
  
  constructor(props:any){
    super(props);
    if(!props.data.qualification){
      props.data.qualification={}
    }
    props.data.dealer.areas=[props.data.dealer.provinces,props.data.dealer.city];
    var areaList:any = []
      if(props.data.dealer.business_area){
        areaList = props.data.dealer.business_area.split(',').map((item:any)=>{
          return {area:item}
        })
     }
    this.setState({business_area:areaList})
    var startDate = props.data.qualification?.fare_term_start;
    var endDate = props.data.qualification?.fare_term_end;
    if(startDate===''){
      startDate=undefined;
    }
    if(endDate===''){
      endDate=undefined;
    }
    props.data.qualification.fare_term_start_time=startDate;
    props.data.qualification.fare_term_end_time=endDate;

    startDate = props.data.qualification?.permission_start;
    endDate = props.data.qualification?.permission_end;
    if(startDate===''){
      startDate=undefined;
    }
    if(endDate===''){
      endDate=undefined;
    }
    props.data.qualification.permission_start_time=startDate;
    props.data.qualification.permission_end_time=endDate;

    startDate = props.data.qualification?.record_start;
    endDate = props.data.qualification?.record_end;
    if(startDate===''){
      startDate=undefined;
    }
    if(endDate===''){
      endDate=undefined;
    }
    props.data.qualification.record_start_time=startDate;
    props.data.qualification.record_end_time=endDate;
  }

  async areaTwo() {
    var data =  request('/xwyl/cm/region/getChinaData',{
    });
    var val =await data;
    this.setState({areas:val.data});
  }

  async areaThree() {
    var data =  request('/xwyl/cm/region/getChinaData?isShowAera=1',{
    });
    var val =await data;
    this.setState({areaThree:val.data});
  }

  async getFileList(id:string,key:string){
    var param:any={shipId:key+id};
    var data =  request('/xwyl/attachment/attachListData',{
      method: 'POST',
      requestType:'form',
      data: {
        ...param,
      },
    });
    var val =await data;
    if(val.errorCode=200){
      val.data.forEach((element:any) => {
        element.uid=element.id;
        element.name=element.attName;
        element.url=element.attPath;
        element.status='done';
      });
      if(key==='yyzz'){
        this.setState({yyzzList:val.data});
      }else  if(key==='lxkz'){
        this.setState({lxkzList:val.data});
      }else  if(key==='eljyba'){
        this.setState({eljybaList:val.data});
      }else  if(key==='kpxx'){
        this.setState({kpxxList:val.data});
      }else  if(key==='frwt'){
        this.setState({frwtList:val.data});
      }else{
        this.setState({khxkzList:val.data});
      }
    }
  }

  deleteRecv(params:any){
    return request('/xwyl/dealer/deleteRecv', {
      method: 'POST',
      requestType:'form',
      data: {
        ...params,
        method: 'post',
      },
    });
  }

  updateDealer(params:any){
    return request('/xwyl/dealer/updateDealer', {
      method: 'POST',
      requestType:'form',
      data: {
        ...params,
        method: 'post',
      },
    });
  }

  saveTicket(params:any){
    return request('/xwyl/dealer/saveTicket', {
      method: 'POST',
      requestType:'form',
      data: {
        ...params,
        method: 'post',
      },
    });
  }

  saveQualification(params:any){
    return request('/xwyl/dealer/saveQualification', {
      method: 'POST',
      requestType:'form',
      data: {
        ...params,
        method: 'post',
      },
    });
  }

  state = {
    previewVisible: false,
    previewImage: '',
    previewTitle: '',
    fullArea:'',
    editableKeys:[],
    areas:[],
    areaThree:[],
    currentArea:{},
    addressModal:false,
    recvList:[],
    yyzzList:[],
    lxkzList:[],
 eljybaList:[],
    khxkzList:[],
    fileList: [],
  kpxxList:[],
  frwtList:[],
   business_area:[],
    fullData:''
  };

  componentDidMount(){
    this.areaTwo();
    this.areaThree();
    this.setState({recvList:this.props.data.recvList});
    var dealerId= this.props.data.dealer.id;
    this.getFileList(dealerId,'yyzz');
    this.getFileList(dealerId,'lxkz');
    this.getFileList(dealerId,'khxkz');
    this.getFileList(dealerId,'eljyba');
    this.getFileList(dealerId,'kpxx');
    this.getFileList(dealerId,'frwt');
  }
b_columns:ProColumns[] = [
    {
      title:'业务区域',
      dataIndex: 'area',
      ellipsis:true,
    },
    {
      title: '操作',
      valueType: 'option',
      width: 80,
      render: (text, record:any, _, action) => this.access==='sale'?[]:[
      <Popconfirm title="确定删除该地区吗?" key="delete_area" onConfirm={() => {
        var list = this.state.business_area.filter((item:any)=>item.area!=record.area)
        this.setState({business_area:list})
      }}>
        <a>删除</a>
      </Popconfirm>
      ]
    },
  ]

  //表头信息以及表值设置
   columns: ProColumns[] = [
    {
      title:'联系人',
      dataIndex: 'recv_consignee',
    },
    {
      title:'电话',
      dataIndex: 'recv_phone',
    },
    {
      title:'邮编',
      dataIndex: 'recv_postcode',
    },
    {
      title:'是否默认',
      dataIndex: 'recv_default',
      renderText:(val)=>{
        return val==='1'?'是':'否';
      }
    },
    {
      title:'地址',
      width:200,
      ellipsis:true,
      dataIndex: 'recv_address',
      renderText:(_,record)=>{
        return `${record.provinces_label}${record.city_label}${record.area_label}${record.recv_address}`
      }
    },
    {
      title: '操作',
      valueType: 'option',
      width: 200,
      hideInTable:!this.props.showForm,
      render: (text, record, _, action) => [
        <a
          key='editable'
          onClick={() => {
            record.areas=[record.provinces,record.city,record.area];
            this.setState({currentArea:record});
            this.setState({addressModal:true});
          }}
        >
          编辑
        </a>,
      <Popconfirm title='确定删除该地址吗?' key='delete' onConfirm={() => this.handleDelete(record.recv_id)}>
        <a>删除</a>
      </Popconfirm>
      ]
    },
  ];

  handleDelete=async (id:any)=>{
    var val=await this.deleteRecv({'recv_id':id});
    if(val.errorCode==='200'){
      message.success('删除成功');
      let index = this.state.recvList.findIndex((item:any)=>{
        return item.recv_id===id;
      })
      this.state.recvList.splice(index,1);
      var newArray=[...this.state.recvList];
      console.log(newArray,val);
      this.setState({recvList:newArray});
    }else{
      message.error('删除失败');
    }
  }

  handlePreview = async (file:any) => {
    this.setState({
      previewImage: file.url || file.preview,
      previewVisible: true,
      previewTitle: file.name || file.url.substring(file.url.lastIndexOf('/') + 1),
    });
  };

  handleCancel = () => this.setState({ previewVisible: false });

  onChange=(val:any,label:any)=>{
    // if(label.length>1){
    //   const fullData = `${label[0].label}/${label[1].label}`;
    //   this.setState({fullData});
    // }else{
    //   const fullData = `${label[0].label}`;
    //   // setFullArea(fullData);
    // }
  }

  addressFinish=(data:any)=>{
    let flag=false;
    var list = this.state.recvList.map((item:any)=>{
      if(item.recv_id===data.recv_id){
        flag=true;
        return data;
      }
      return item;
    })
    if(!flag){
      list.push(data);
    }
    this.setState({recvList:list});
  }

  uploadProps = {
    name: 'file',
    action: '/xwyl/attachment/uploadAttach',
    headers: {
      authorization: 'authorization-text',
    }
  };

  render() {
    const { previewVisible, previewImage, fileList, previewTitle ,yyzzList,lxkzList,khxkzList,eljybaList,kpxxList,frwtList} = this.state;
    const uploadButton = (
      <div>
        <PlusOutlined />
        <div style={{ marginTop: 8 }}>点击上传资质</div>
      </div>
    );
    return (
      <>
      <Tabs defaultActiveKey='1' centered>
      <TabPane tab='基本信息' key='1'>
        <ProForm
          submitter={this.props.showForm}
          style={{marginTop:16}}
          initialValues={this.props.data.dealer}
          onFinish={async (values) => {
              values.id = this.props.data.dealer.id;
              values.provinces = values.areas[0]
              if(values.areas.length==2){
                values.city = values.areas[1]
              }
              var val = await this.updateDealer(values);
              if(val.errorCode==='200'){
                message.success('更新成功');
              }else{
                message.error('更新失败');
              }
              console.log(val);
          }}>
        
            <ProForm.Group>
              <ProFormText  name='cnName' label='签约客户名称(中文) ' rules={[{ required: true}]}  allowClear={false} width='md'/>
              <ProFormText  name='enName' label='关联客户名称' allowClear={false}  width='md'/>
           </ProForm.Group>

           <ProForm.Group>
            <ProFormText  name="mail" label="开户邮箱" rules={[{ required:true},{pattern: /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/,message: '邮箱格式不正确',}]}  width="lg" allowClear={false}/>
           </ProForm.Group>
            <ProTable
            columns={this.b_columns}
            toolbar={{settings:[]}}
            headerTitle="业务区域"
            style={{width:485,marginLeft:-20,marginTop:-20,marginBottom:20}}
            dataSource={this.state.business_area}
            rowKey="area"
            pagination={false}
            search={false}
            toolBarRender={() => []}>
	    </ProTable>


           <ProForm.Group>
              <ProFormText  name='legal_person' label='法定代表人' rules={[{ required: true}]} width='sm' allowClear={false}/>
              <ProFormText  name='manager_person' label='企业负责人' rules={[{ required: true}]}  width='sm' allowClear={false}/>
              {/* <ProFormText  name='quality_person' label='质量负责人'  width='sm' allowClear={false}/> */}
           </ProForm.Group>
           <ProForm.Group>
            <ProFormText  name='office_address' label='实际办公地址' allowClear={false} width={700} rules={[{ required: true}]}/>	
           <ProFormText  name='warehouse_address' label='实际仓库地址' rules={[{ required: true}]} width={700} allowClear={false}/>
           {/* <ProFormText  name='registered_address' label='注册地址' rules={[{ required: true}]} width={1000}  allowClear={false}/> */}
           </ProForm.Group>
           <ProForm.Group>
           <Form.Item
                name="areas"
                label="注册地区"
                rules={[
                  {
                    required: true
                  },
                ]} 
              >
                <Cascader
                  options={this.state.areas}
                  placeholder="请选择"
                  onChange={this.onChange}
              />
            </Form.Item>
              <ProFormText  name="registered_address" label="注册详细地址" allowClear={false} width={600} rules={[{ required: true}]}/>
            </ProForm.Group>

           <ProForm.Group>
              <ProFormText  name='registered_phone' label='注册电话' rules={[{ required: true}]} width='sm' allowClear={false}/>
              <ProFormText  name='office_postcode' label='办公室邮编' rules={[{ required: true}]} width='sm' allowClear={false}/>
              <ProFormText  name='office_phone' label='办公电话' rules={[{ required: true}]}  width='sm' allowClear={false}/>
          </ProForm.Group>  
        </ProForm>     
      </TabPane>
      <TabPane tab='联系人信息' key='2'>
        <ProForm 
          style={{marginTop:16}}
          submitter={this.props.showForm}
          initialValues={this.props.data.dealer}
          onFinish={async (values) => {
            values.id = this.props.data.dealer.id;
            var val = await this.updateDealer(values);
            if(val.errorCode==='200'){
              message.success('更新成功');
            }else{
              message.error('更新失败');
            }
          }}>
         
            <ProForm.Group>
                <ProFormText  name='primary_contact' label='实际销售业务主要负责人' rules={[{ required: true}]}  width='sm' allowClear={false}/>
                <ProFormText  name='primary_phone' label='电话' rules={[{ required: true}]} width='sm' allowClear={false}/>
                <ProFormText  name='primary_mail' label='邮箱' rules={[{ required: true},{pattern: /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/,message: '邮箱格式不正确'}]} width='sm' allowClear={false}/>
            </ProForm.Group>
            <ProForm.Group>
              <ProFormText  name="businessBoss" label="公司老板" rules={[{ required: true}]}   width="sm" allowClear={false}/>
              <ProFormText  name="bossPhone" label="电话" rules={[{ required: true}]}   width="sm" allowClear={false}/>
            <ProFormText  name="bossMail" label="邮箱"  rules={[{ required: true},{pattern: /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/,message: '邮箱格式不正确',}]}  width="sm" allowClear={false}/>
          </ProForm.Group>
            <ProForm.Group>
              <ProFormText  name='logistics_contact' label='质量联系人' rules={[{ required: true}]}   width='sm' allowClear={false}/>
              <ProFormText  name='logistics_phone' label='电话' rules={[{ required: true}]} width='sm' allowClear={false}/>
            <ProFormText  name='logistics_mail' label='邮箱'  rules={[{ required: true},{pattern: /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/,message: '邮箱格式不正确',}]} width='sm' allowClear={false}/>
          </ProForm.Group>
          <ProForm.Group>
                <ProFormText  name='quality_contact' label='物流联系人' rules={[{ required: true}]}  width='sm' allowClear={false}/>
                <ProFormText  name='quality_phone' label='电话' rules={[{ required: true}]} width='sm' allowClear={false}/>
                <ProFormText  name='quality_mail' label='邮箱' rules={[{ required: true},{pattern: /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/,message: '邮箱格式不正确',}]} width='sm' allowClear={false}/>
          </ProForm.Group>
          <ProForm.Group>
                <ProFormText  name='financial_contact' label='财务联系人' rules={[{ required: true}]}  width='sm' allowClear={false}/>
                <ProFormText  name='financial_phone' label='电话' rules={[{ required: true}]} width='sm' allowClear={false}/>
                <ProFormText  name='financial_mail' label='邮箱' rules={[{ required: true},{pattern: /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/,message: '邮箱格式不正确',}]} width='sm' allowClear={false}/>
          </ProForm.Group>
        </ProForm>
      </TabPane>
      <TabPane tab='客户资质' key='3'>
        <ProForm
            style={{marginTop:16}}
            submitter={this.props.showForm}
            initialValues={this.props.data.qualification}
            onFinish={async (values) => {
              values.dealerId = this.props.data.dealer.id;
              // values.fare_term_start_time = values.fare_term_start;
              // values.fare_term_start_end = values.fare_term_end;
              // values.permission_start_time = values.permission_start;
              // values.permission_end_time = values.permission_end;
              // values.record_start_time = values.record_start;
              // values.record_end_time = values.record_end;
              var val = await this.saveQualification(values);
              if(val.errorCode==='200'){
                message.success('更新成功');
              }else{
                message.error('更新失败');
              }
            }}
          >
            <ProForm.Group >
              <ProFormText  name='business_licenseNo' label='营业执照号' rules={[{ required: true}]}  width='sm' allowClear={false}/>
              <ProFormDatePicker width='sm' name='fare_term_start_time' label='营业执照有效期开始日期' rules={[{ required: true}]}  allowClear={false}/>
              <ProFormDatePicker width='sm' name='fare_term_end_time' label='营业执照有效期结束日期'  allowClear={false}/>
              <ProFormSelect width="sm" name="isLongTerm" label="营业执照长期有效" allowClear={false} options={[{label:'是',value:"1"},{label:'否',value:"0"}]} />
              <ProFormText  name='econ_kind' label='企业类型' rules={[{ required: true}]} width='sm' allowClear={false}/>
           </ProForm.Group>
            <ProFormTextArea name='fare_scope' label='营业执照经营范围' rules={[{ required: true}]} placeholder='' fieldProps={{showCount:true,maxLength:500}} allowClear={false} />
            <ProForm.Group>
              <ProFormText  name='license_number' label='三类医疗器械经营许可证号' rules={[{ required: true}]}  width='sm' allowClear={false}/>
              <ProFormDatePicker width='sm' name='permission_start_time' label='经营许可有效期开始日期' rules={[{ required: true}]}   allowClear={false}/>
              <ProFormDatePicker width='sm' name='permission_end_time' label='经营许可有效期结束日期' rules={[{ required: true}]}   allowClear={false}/>
          </ProForm.Group>
   	  <div style={{width:'900px'}} >
            <ProFormTextArea name="licence_fare_scope" label="经营许可证经营范围" rules={[{ required: this.props.admin?false:true}]} placeholder="" fieldProps={{showCount:true,maxLength:500}} allowClear={false} />
            </div>
            <ProForm.Group>
                <ProFormText  name="warehouse_address2" label="经营许可证上经营场所" rules={[{ required: this.props.admin?false:true}]}  width={600} allowClear={false}/>
          </ProForm.Group>
          <ProForm.Group>
            <ProFormText  name="warehouse_address" label="经营许可证上库房地址" rules={[{ required: this.props.admin?false:true}]}  width={600} allowClear={false}/>
          </ProForm.Group>
          <ProForm.Group>
                <ProFormText  name='record_number' label='二类医疗器械经营备案凭证号' width='sm' allowClear={false}/>
                <ProFormDatePicker width='sm' name='record_start_time' label='经营备案有效期开始日期'  allowClear={false}/>
                <ProFormDatePicker width='sm' name='record_end_time' label='经营备案有效期结束日期'  allowClear={false}/>
                <ProFormSelect width="sm" name="recordLongTerm" label="营业执照长期有效" allowClear={false} options={[{label:'是',value:"1"},{label:'否',value:"0"}]} />
          </ProForm.Group>
          { this.props.showForm?
          <Upload
          {...this.uploadProps} data={{'shipId':this.props.data.dealer.id,'userId':sessionStorage.getItem('userId')}} headers={{
          'authorization':`${sessionStorage.getItem('token')}`}} 
          listType='picture-card'
          fileList={fileList}
          onPreview={this.handlePreview}
          onRemove={(record)=>{
            confirm({
              content: '确定删除吗？',
              onOk:async()=> {
                var req = request('/xwyl/attachment/deleteAtt', {
                  method: 'POST',
                  requestType:'form',
                  data: {
                    ...{id:record.uid},
                    method: 'post',
                  },
                });
                var val =await req;
                if(val.errorCode==='200'){
                  var newList=fileList.filter((item:any)=>{
                    return item.uid!=record.uid;
                  });
                  this.setState({fileList:newList});
                }else{
                  message.error('删除失败');
                }
              },
              onCancel() {
                console.log('Cancel');
              },
            });
          }}
          onChange={(info:any)=>{
            if (info.file.status !== 'uploading') {
              console.log(info.file, info.fileList);
            }
            if (info.file.status === 'done') {
              if(info.file.response.errorCode==='200'){
                message.success(`${info.file.name}上传成功`);
                var data = info.file.response.data;
                data.uid = data.attId;
                data.name = info.file.name;
                data.url = data.location;
                data.status ='done';
                fileList.push(data);
                this.setState({fileList:[...fileList]});
              }else{
                message.error(`${info.file.name} 上传失败.`);
              }
            } else if (info.file.status === 'error') {
              message.error(`${info.file.name} 上传失败.`);
            }
          }}
        >
            {uploadButton}
        </Upload>
          :
          <>
             <h3>营业执照</h3>
             <Upload
              {...this.uploadProps} data={{'shipId':'yyzz'+this.props.data.dealer.id,'userId':sessionStorage.getItem('userId')}} headers={{
              'authorization':`${sessionStorage.getItem('token')}`}} 
              listType='picture-card'
              fileList={yyzzList}
              onPreview={this.handlePreview}
              showUploadList={{showRemoveIcon:false}}
            >
            </Upload>
            <h3>三类医疗器械经营许可证</h3>
             <Upload
              {...this.uploadProps} data={{'shipId':'yyzz'+this.props.data.dealer.id,'userId':sessionStorage.getItem('userId')}} headers={{
              'authorization':`${sessionStorage.getItem('token')}`}} 
              listType='picture-card'
              fileList={lxkzList}
              onPreview={this.handlePreview}
              showUploadList={{showRemoveIcon:false}}
            >
            </Upload>
            <h3>二类医疗器械经营备案</h3>
             <Upload
              {...this.uploadProps} data={{'shipId':'eljyba'+this.props.data.dealer.id,'userId':sessionStorage.getItem('userId')}} headers={{
              'authorization':`${sessionStorage.getItem('token')}`}} 
              listType='picture-card'
              fileList={eljybaList}
              onPreview={this.handlePreview}
              showUploadList={{showRemoveIcon:false}}
            >
            </Upload>
            <h3>基本存款账户信息</h3>
             <Upload
              {...this.uploadProps} data={{'shipId':'yyzz'+this.props.data.dealer.id,'userId':sessionStorage.getItem('userId')}} headers={{
              'authorization':`${sessionStorage.getItem('token')}`}} 
              listType='picture-card'
              fileList={khxkzList}
              onPreview={this.handlePreview}
              showUploadList={{showRemoveIcon:false}}
            >
            </Upload>
            <h3>开票信息</h3>
             <Upload
              {...this.uploadProps} data={{'shipId':'kpxx'+this.props.data.dealer.id,'userId':sessionStorage.getItem('userId')}} headers={{
              'authorization':`${sessionStorage.getItem('token')}`}} 
              listType='picture-card'
              fileList={kpxxList}
              onPreview={this.handlePreview}
              showUploadList={{showRemoveIcon:false}}
            >
            </Upload>
            <h3>采购法人授权委托书</h3>
             <Upload
              {...this.uploadProps} data={{'shipId':'frwt'+this.props.data.dealer.id,'userId':sessionStorage.getItem('userId')}} headers={{
              'authorization':`${sessionStorage.getItem('token')}`}} 
              listType='picture-card'
              fileList={frwtList}
              onPreview={this.handlePreview}
              showUploadList={{showRemoveIcon:false}}
            >
            </Upload>
          </>
        }
          <Modal
            visible={previewVisible}
            title={previewTitle}
            width={1000}
            footer={null}
            onCancel={this.handleCancel}
           >
          <img style={{ width: '100%' }} src={previewImage} />
        </Modal>
        </ProForm>
      </TabPane>
      <TabPane tab='收货信息' key='4'>

        <ProTable<RecvAddress>
            style={{marginTop:16}}
            columns={this.columns}
            toolbar={{settings:[]}}
            dataSource={this.state.recvList}
            rowKey='recv_id'
            pagination={false}
            search={false}
            toolBarRender={this.props.showForm?() => [
              <Button
                type='primary'
                key='primary'
                onClick={() => {
                  this.setState({addressModal:true});
                }}
              >
                新增
              </Button>,
            ]:false}
          >
        </ProTable>
      </TabPane>
      <TabPane tab='开票信息' key='5'>
        <ProForm
            style={{marginTop:16}}
            submitter={this.props.showForm}
            initialValues={this.props.data.ticket}
            onFinish={async (values) => {
              values.dealerId=this.props.data.dealer.id;
              values.provinces=values.areas[0]
              values.city=values.areas[1]
              values.area=values.areas[2]
              var val = await this.saveTicket(values);
              if(val.errorCode==='200'){
                message.success('更新成功');
              }else{
                message.error('更新失败');
              }
            }}
        >
            <ProForm.Group >
              <ProFormText  name='account_name' label='开户名称' rules={[{ required: true}]} allowClear={false}   width='md'/>
              <ProFormText  name='duty_paragraph' label='税号' rules={[{ required: true}]}  allowClear={false}  width='md'/>
           </ProForm.Group>
           <ProForm.Group >
              <ProFormRadio.Group width='md' disabled={!this.props.showForm}  rules={[{ required: true}]}   label='一般纳税人' name='isTaxpayer' allowClear={false}  options={[{label:'是',value:1}, {label:'否',value:0}]}  />
              <ProFormRadio.Group label='发票类型' disabled={!this.props.showForm} rules={[{ required: true}]}   width='md' name='invoice_type' allowClear={false} options={[{label:'专票',value:'1'}, {label:'普票',value:'2'}]}/>
            </ProForm.Group>
            <ProForm.Group >
              <ProFormText  name='bank' label='开户银行' rules={[{ required: true}]}  allowClear={false}  width='sm'/>
              <ProFormText  name='bank_account' label='银行账号' rules={[{ required: true}]}  allowClear={false}  width='sm'/>
              <ProFormText  name='invoice_phone' label='开票电话' rules={[{ required: true}]}  allowClear={false}  width='sm'/>
              <ProFormText  name='invoice_address' label='开票地址' rules={[{ required: true}]} allowClear={false}   width='sm'/>
            </ProForm.Group>
            <ProForm.Group >
              <ProFormText  name='recipient' label='收件人' rules={[{ required: true}]} allowClear={false}   width='sm'/>
              <ProFormText  name='recipient_phone' label='收件人电话' rules={[{ required: true}]} allowClear={false}   width='sm'/>
              <ProFormText  name='mail' label='邮箱地址'  allowClear={false} width='sm'/>
            </ProForm.Group>
            <ProForm.Group >
              <Form.Item
                  name='areas'
                  label='收件地区'
                  rules={[
                    {
                      required: true,
                    },
                  ]} 
                  style={{width:'440px'}}
                >
                  <Cascader
                    options={this.state.areaThree}
                    placeholder='请选择'
                    onChange={this.onChange}
                />
              </Form.Item>
            </ProForm.Group>
            <ProFormText  name='send_address' label='寄票详细地址' rules={[{ required: true}]}    width='lg'/>

          </ProForm>
      </TabPane>
    </Tabs>
    <AddressDialog data={this.state.currentArea} modalVisible={this.state.addressModal}
      id={this.props.data.dealer.id}
     areaThree={this.state.areaThree}
     onCancel={(val)=>{this.setState({addressModal:val})}} onFinish={this.addressFinish} />
    </>
    );
  }
}

export default DealerInfo